<template>
  <div style="position: relative; width: 100%; height: 100%">
    <iframe
      ref="video"
      :key="ezOpenUrl"
      :src="ezOpenUrl"
      width="100%"
      height="100%"
      allowFullScreen
      style="position: absolute; z-index: 9; top: 0; left: 0; width: 100%; height: 100%; border: none"
    />
  </div>
</template>
<script>
export default {
  name: 'EzOpenWebPluginPlayer',
  inheritAttrs: false,
  props: {
    autoplay: { type: Boolean, default: true },
    streamUrl: { type: String, default: '' },
    accessToken: { type: String, default: '' },
  },
  computed: {
    ezOpenUrl() {
      const autoplay = this.autoplay ? 1 : 0;
      return `https://open.ys7.com/ezopen/h5/iframe_se?url=${this.streamUrl}&autoplay=${autoplay}&audio=1&accessToken=${this.accessToken}`;
    },
  },
};
</script>
